<template>
  <div class="citylist">
      <h1>城市选择</h1>

        <ul>
            <li  class="item" v-for="(item,index) in list" :key="index" @click="choes(item)"><span>{{item.label}}</span></li>
        </ul>
        
  </div>
</template>
<script>
import request from "../../utils/information";
export default {
    data() {
        return {
            list:[],
             value: '',
        }
    },
   onShow() {
       request.get("/area/city",{level:1}).then(ok=>{
           this.list = ok.body
       })
   },
   methods: {
      choes(item){
          uni.setStorageSync('city', item.label);
          uni.switchTab({ url: `/pages/index/index` })
      } 
   },
}
</script>
<style lang="scss" scoped>

    h1{
        width: 100%;
        font-size: 30rpx;
        font-weight: 800;
        text-align: center;
        padding: 30rpx 0;
    }
    .item{
        padding:  20rpx 0 ;
        border-bottom: 1rpx solid #ccc;
    }
    span{
        margin-left: 20rpx;
    }
</style>